\chapter{Développement}

	Dans ce chapitre nous présenterons la version 2. Cette version porte le nom "Humeurs" et est déclinée comme un jeu. Toute l'interface à été repensée pour être en adéquation avec un site ludique destiné à un public de tout âge et de tous horizons. 
	
	\section{Page d'accueil}
		
		La page d'accueil (cf fig.~\ref{V2-interface-index}) permet de s'inscrire ou de se connecter. Le processus d'inscription et de connexion seront décrits par la suite. 
		
		\begin{figure}[H]
			\centering
			\hspace*{-0.2\textwidth}
			\includegraphics[width=1.4\textwidth]{./img/V2/interface/accueil}
			\caption{Page d'accueil}
			\label{V2-interface-index}
		\end{figure}
		
	\section{De l'individu à l'utilisateur}
		
		Afin de pouvoir jouer, un individu doit s'inscrire de manière à devenir un utilisateur d'"Humeurs". Pour ce faire il doit tout d'abord renseigner son adresse mail. Un mail lui sera envoyé avec un mot de passe auto-généré pour confirmer l'inscription, il doit ensuite se connecter avec son adresse mail et le mot de passe reçu. A sa première connexion il doit redéfinir son mot de passe de sorte qu'il soit plus sécurisé (cf fig.~\ref{V2-interface-confirmAccount}). 
		
		\begin{figure}[H]
			\centering
			\hspace*{-0.2\textwidth}
			\includegraphics[width=1.4\textwidth]{./img/V2/interface/confirmationPasse}
			\caption{Confirmation de l'inscription}
			\label{V2-interface-confirmAccount}
		\end{figure}
		
		Une fois devenu utilisateur, ce dernier pourra modifier son mot de passe (cf fig.~\ref{V2-interface-param}). \\ 
		Si l'utilisateur l'a oublié, il peut demander à le modifier. Dans la page d'accueil (cf fig.~\ref{V2-interface-index}) il lui suffit de renseigner son adresse mail et de presser le bouton "mot de passe oublié ?", cela engendrera l'envoi d'un mail avec un nouveau mot de passe temporaire. A sa prochaine connexion l'utilisateur devra alors redéfinir son mot de passe. \\ 
		
		L'utilisateur peut également supprimer son compte, ainsi toutes ses données seront supprimées. Pour un compte administrateur, s'il est le seul compte de ce type il ne pourra pas être supprimé. Il faudra donc d'abord définir un nouvel administrateur.
		
		\begin{figure}[H]
			\centering
			\hspace*{-0.2\textwidth}
			\includegraphics[width=1.4\textwidth]{./img/V2/interface/menuParametres}
			\caption{Menu des paramètres}
			\label{V2-interface-param}
		\end{figure}
	
	\section{De l'utilisateur au joueur}
	
		Lorsqu'il a créé son compte, l'utilisateur doit ajouter des membres qui deviendront alors des joueurs (cf fig.~\ref{V2-interface-newMember}). Ces derniers pourront alors lancer une partie.  
		
		\begin{figure}[H]
			\centering
			\hspace*{-0.2\textwidth}
			\includegraphics[width=1.4\textwidth]{./img/V2/interface/menuAjoutMembre}
			\caption{Menu d'ajout de membre}
			\label{V2-interface-newMember}
		\end{figure}
	
	\section{Le jeu}
		
		Nous allons maintenant présenter les différentes étapes d'une partie. 
		
		\subsection{Réglages d'une partie}
		
			Une partie débute par deux choix (cf fig.~\ref{V2-interface-gameMenu}): celui de l'humeur dans laquelle le joueur se définit, en selectionnant l'émoticône qui décrit cet état, et celui de la forme avec laquelle il va vouloir jouer. \\
			L'humeur selectionnée va déclencher une ambiance sonore en cohérence avec l'humeur, ainsi un joueur heureux entendra une musique renforçant cet état durant la partie.
		
			\begin{figure}[H]
				\centering
				\hspace*{-0.2\textwidth}
				\includegraphics[width=1.4\textwidth]{./img/V2/interface/menuJeu}
				\caption{Menu de réglage du jeu}
				\label{V2-interface-gameMenu}
			\end{figure}
		
		\subsection{Le jeu}
		
			Le jeu des couleurs (cf fig.~\ref{V2-interface-game}) est similaire au test de la version 1. Cependant les couleurs n'apparaissent que sous une seule forme, le nombre de choix est donc réduit. Le fonctionnement reste le même, le joueur doit choisir la couleur qu'il préfére en pressant la touche fléchée correspondante.
		
			\begin{figure}[H]
				\centering
				\hspace*{-0.2\textwidth}
				\includegraphics[width=1.4\textwidth]{./img/V2/interface/sessionDeJeu}
				\caption{Jeu des couleurs}
				\label{V2-interface-game}
			\end{figure}
			
		\subsection{Les résultats}
			
			Une fois le jeu complété, le joueur peut visualiser les résultats de sa partie (cf fig.~\ref{V2-interface-results}). \\ 
			
			\begin{figure}[H]
				\centering
				\includegraphics[width=0.9\textwidth]{./img/V2/interface/resultats}
				\caption{Affichage des résultats}
				\label{V2-interface-results}
			\end{figure}
			
			La représentation sous forme de graphe secteur est réalisée grâce à la fonction suivante : \\
			
			\lstset{language=java,numbers=left, basicstyle=\scriptsize\ttfamily,showstringspaces=false}
			\lstinputlisting[language=java]{./sources/V2-createPieChart.js}
			
			Si le joueur a choisi de partager ses données, elles seront alors enregistrées dans la base de données et il pourra les visualiser à nouveau, sinon il ne pourra les visualiser qu'à la fin de la partie. \\ 
			S'il a choisi de partager ses données, il pourra donc accéder à ses résultats à tout moment depuis le menu des résultats (cf fig.~\ref{V2-interface-resultsMenu}) qui répertorie toutes ses parties.
			
			\begin{figure}[H]
				\centering
				\hspace*{-0.2\textwidth}
				\includegraphics[width=1.4\textwidth]{./img/V2/interface/menuResultats}
				\caption{Menu des résultats}
				\label{V2-interface-resultsMenu}
			\end{figure}
	
	\section{Un joueur VIP : l'administrateur}
	
		Un administrateur est un joueur normal avec des droits supplémentaires. La différence réside dans le menu d'administration (cf fig.~\ref{V2-interface-admin}). Depuis ce menu il peut modifier les couleurs, les formes, les humeurs et les comptes administrateurs. Il pourra également récupérer les résultats collectés. \\
		La récupération des résultats repose sur un web service (accessible par un programme externe) qui retourne un fichier json contenant les résultats. Le web service requiert une identification (adresse mail et mot de passe encodés), de fait, uniquement les administrateurs peuvent récupérer les données. Afin d'utiliser le web service depuis un programme externe il faut récupérer le lien obtenu depuis l'interface administrateur. 
	
		\begin{figure}[H]
			\centering
			\hspace*{-0.2\textwidth}
			\includegraphics[width=1.4\textwidth]{./img/V2/interface/menuAdmin}
			\caption{Menu d'administration}
			\label{V2-interface-admin}
		\end{figure}
	
		\noindent La gestion des couleurs (cf fig.~\ref{V2-interface-color}) permet :
		\begin{itemize}
			\item d'en ajouter : il faut lui donner un nom et renseigner les valeurs RGB
			\item de les modifier : cela consiste à changer les valeurs RGB
			\item de les desactiver : la couleur n'apparaitra plus dans le jeu, cependant elle est sauvegardée de manière à ne pas fausser les précédents tests. 
		\end{itemize}
	
		\begin{figure}[H]
			\centering
			\hspace*{-0.2\textwidth}
			\includegraphics[width=1.4\textwidth]{./img/V2/interface/newColor}
			\caption{Gestion des couleurs}
			\label{V2-interface-color}
		\end{figure}
		
		\noindent La gestion des formes (cf fig.~\ref{V2-interface-shape}) permet :
		\begin{itemize}
			\item d'en ajouter : il faut tout d'abord créer une fonction javascript permettant de dessiner la forme, ensuite pour ajouter la forme au test il suffit de la nommer et d'appeller la fonction correspondante
			\item de les modifier : cela consiste à changer la fonction appellée
			\item de les desactiver : la forme n'apparaitra plus dans le jeu, cependant elle est sauvegardée de manière à ne pas fausser les précédents tests. 
		\end{itemize}
		
		\begin{figure}[H]
			\centering
			\hspace*{-0.2\textwidth}
			\includegraphics[width=1.4\textwidth]{./img/V2/interface/newShape}
			\caption{Gestion des formes}
			\label{V2-interface-shape}
		\end{figure}
		
		\noindent La gestion des humeurs (cf fig.~\ref{V2-interface-mood}) permet : 
		\begin{itemize}
			\item d'en ajouter : il faut renseigner le nom et lui affecter une image et une musique
			\item de les modifier 
			\item de les desactiver : l'humeur ne sera plus proposée au joueur, cependant elle est sauvegardée de manière à ne pas fausser les précédents tests
		\end{itemize}
		
		\begin{figure}[H]
			\centering
			\hspace*{-0.2\textwidth}
			\includegraphics[width=1.4\textwidth]{./img/V2/interface/newMood}
			\caption{Gestion des humeurs}
			\label{V2-interface-mood}
		\end{figure}
		
		\noindent La gestion des comptes d'administration (cf fig.~\ref{V2-interface-adminAccount}) permet : 
		\begin{itemize}
			\item d'en ajouter : il faut renseigner l'adresse mail du nouvel administrateur
			\item d'en supprimer : l'ancien administrateur redeviendra un utilisateur lambda
		\end{itemize}
		
		\begin{figure}[H]
			\centering
			\hspace*{-0.2\textwidth}
			\includegraphics[width=1.4\textwidth]{./img/V2/interface/newAdmin}
			\caption{Gestion des comptes administrateurs}
			\label{V2-interface-adminAccount}
		\end{figure}